<template>
  <div class="home">
    <Head></Head>
<!--    <el-carousel :interval="4000" type="card" height="200px">
      <el-carousel-item v-for="(item,index) in imgList" :key="index">
        <img :src="item.pic" alt="" />
      </el-carousel-item>
    </el-carousel>-->
    <van-swipe class="my-swipe" :autoplay="2000" indicator-color="white">
      <van-swipe-item
        v-for="(item, index) in imgList"
        :key="item.index"
        style="height: 100%; line-height: 0"
      >
        <a :href="item.url">
          <img :src="item.pic" alt="加载中..." style="width: 100%; height: 3.5rem" />
        </a>
      </van-swipe-item>
    </van-swipe>
    <!-- ------------------------->
    <div class="main-box">
      <div class="car-box">
        <div v-for="(item, index) in imgList1" :key="index">
          <img :src="item.pic" :alt="item.note" />
          <p>{{ item.note }}</p>
        </div>
<!--        <el-carousel :interval="4000" type="card" height="200px">
          <el-carousel-item v-for="(item,index) in imgList" :key="index">
            <img :src="item.pic" alt="" />
          </el-carousel-item>
        </el-carousel>-->
      </div>
<!--      <van-button plain type="primary" size="large" @click="$router.push('/home')"-->
      <van-button plain type="primary" size="large" @click="onClick"
      >开始租车</van-button>
      <div class="box-bouttom">
        <div>
          <h3>公司介绍</h3>
          <p>
            河南省小朋友汽车服务有限公司是河南省内早期经上级主管部门批准并登记注册的汽车租赁公司，
            河南省道路运输协会汽车租赁工作委员会理事长单位，注册资金一千零一万元整（工商在线查询）。
            以社会各界需要用车的个人、企事业单位为服务对象，提供包括婚庆租车，旅游租车，商务租车，
            会议租车等各种类型的汽车租赁服务，是一家专业汽车租赁服务公司。
          </p>
        </div>
        <div>
          <div>
            <h4>联系我们</h4>
            <p>公司地址：黄河路76号附16号合立大厦东配楼二楼</p>
            <p>联系电话：1597886541</p>
          </div>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
import Head from "../components/Home/Head";
 /* import { carousel, middleImg } from "../request/home/home_http";*/
export default {
  /*props: {},*/
  data() {
    return {
      imgList:[],
      imgList1:[],
      num:3,
      num2:3,
     /* swipe_list: null,
      middle_list: null,*/
      username:"",
      idCode:"",
      pathFront:"",
      pathReverse:"",
    };
  },
   created() {
    this.getHeadNum();
    this.selectName();

  },

  methods: {
    onClick(){
      if(this.idCode != null &&this.idCode != "" && this.pathFront != null &&this.pathFront != "" && this.pathReverse != null &&this.pathReverse != "" ){
        this.$router.push('/home')
      }else{
        this.$toast.fail('请实名认证');
      }
    },
    selectName(){
      this.username=window.localStorage.getItem('ms_username')
      this.$http.post("http://192.168.1.195:8000/marketingManagement/api/getUserInfo/"+this.username).then(res => {
        this.idCode=res.data.data.idCode
        this. pathFront=res.data.data. pathFront
        this.pathReverse=res.data.data.pathReverse
       console.log(this.idCode,this. pathFront,this.pathReverse)
      });

    },





    getHeadNum() {
      this.$http.post("/marketingManagement/api/getHeadNum/").then(res => {
        //console.log(res);
        this.num=res.data.data
        this.getHeadNum2();
        //console.log("qu"+this.num);
      });
    },
    getHeadNum2() {
      this.$http.post("/marketingManagement/api/getCentralNum/").then(res => {
        //console.log(res);
        this.num2=res.data.data
        //console.log("qu"+this.num2);
        this.getUrl()
      });
    },

    getUrl() {
      //console.log(this.num)
      this.$http.post("/marketingManagement/api/getAdvertise/"+this.num).then(res => {
        //console.log(res);
        this.imgList=res.data.data
        //console.log(this.imgList)
        this.getUrl2()
      });
    },
    getUrl2() {
      this.$http.post("/marketingManagement/api/getCentral/"+this.num2).then(res => {
        //console.log(res);
        this.imgList1=res.data.data
        //console.log(this.imgList1)
      });
    },
  },
 /* mounted() {
    // 顶部轮播广告请求
    carousel({
      pageNo:1,
      pageSize:10,
      data:{
        positionId: 1,
        status: 1,
        name:""
      }
    }).then((res) => {
      console.log("顶部请求------------")
      console.log(res)
      this.swipe_list = res.data.records;
    }); 
    // 中部广告请求
    middleImg({

      pageNo:1,
      pageSize:10,
      data:{
        positionId: 2,
        status: 1,
        name:""
      }
    }).then((res) => {``
      console.log("中部请求------------")
      console.log(res)
      this.middle_list = res.data.records;
    });

    //
  },*/
  components: {
    Head,
  },
};
</script>

<style scoped lang="less">
* {
  box-sizing: border-box;
}
.home {
  height: 100%;
  font-size: 0.28rem;
  .my-swipe .van-swipe-item {
    //轮播
    color: #fff;
    font-size: 20px;
    line-height: 150px;
    text-align: center;
    background-color: #39a9ed;
  }

  .main-box {
    .title {
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center;
      padding: 0.3rem 0;
      > h3 {
        font-size: 0.32rem;
        color: #666;
        margin-bottom: 0.05rem;
      }
      > p {
        font-size: 0.12rem;
        color: var(--groot-ui-color-gray-7);
      }
    }
    .car-box {
      width: 100%;
      display: flex;
      justify-content: space-around;
      text-align: center;
      div {
        // border: 1px solid;
        width: 30%;
        display: inline-block;
        background-color: rgb(248, 248, 248);
        img {
          display: inline-block;
          width: 100%;
          height: 2rem;
          padding: 0.1rem;
        }
        p {
          color: #555;
          font-size: 0.12rem;
          padding: 0.05rem;
        }
      }
    }
    button {
      // color: #555;
      letter-spacing: 0.02rem;
      font-size: 0.26rem;
      width: 60%;
      margin: 0.3rem 0;
      border: 1px solid #ccc;
      margin-left: 1.5rem;
      height: 0.65rem;
    }
    .box-bouttom {
      > div {
        display: inline-block;
      }
      > div:nth-of-type(1) {
        width: 100%;
        padding: 0.2rem;
        background-color: rgb(248, 248, 248);
        h3 {
          margin-bottom: 0.1rem;
        }
        p {
          color: #666;
          font-size: 0.16rem;
        }
      }
      > div:nth-of-type(2) {
        width: 100%;
        height: 2.2rem;
        margin-top: 0.2rem;
        display: flex;
        justify-content: center;
        background: url("https://jianzhan-image.cdn.bcebos.com/jimuyu/pcSite/tplImage/联系我们-图片.png@f_webp,q_90")
          no-repeat;
        background-size: 100% 100%;
        position: relative;
        > div {
          color: #eee;
          width: 80%;
          // border: 1px solid;
          position: absolute;
          top: 20%;
          p {
            font-size: 0.16rem;
            margin: 0.1rem 0;
          }
        }
      }
    }
  }
}
</style>
